import { ReactNode } from 'react';
import api from '../../atoms/api';
import { Message as M1, Result as R1 } from '../api/activity/addfollow.api';

export default function Infocontainer(
	{
		title,
		value
	}: {
		title: string
		value: string
	}) {
	return <>
		<div className='v'>
			<div className='bg'>
				<span className='lbl'>{title}：</span>
			</div>
			<span className='val'>{value}</span>
		</div>
		<style jsx>{`
.v{
display: flex;
flex-direction: row;
align-items: flex-start;
width: 100%;
margin-bottom: 0.2rem;
}
.bg{
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
width: 7rem;
flex-grow: 0;
}
.lbl{
font-size: 0.875rem;
color: #505D68;
text-shadow: 0rem 0.25rem 0.25rem rgba(0, 0, 0, 0.25);
text-align: end;
}
.val{
font-size: 0.875rem;
color: #000000;
}
`}</style>
	</>;
}
